<template>
  <div>
    <h3>{{ title }}</h3>
    <vs-radio
      v-for="(opt, i) in options"
      :key="i"
      :val="opt.value"
      :value="value"
      @input="onInput"
      >{{ opt.label }}</vs-radio
    >
  </div>
</template>

<script>
import Vue from "vue";
import shortid from "shortid";
export default Vue.extend({
  props: {
    title: {
      required: true,
      type: String
    },
    options: {
      required: true,
      type: Array
    },
    value: {
      required: true
    }
  },
  data() {
    return {
      name: shortid.generate()
    };
  },
  methods: {
    onInput(e) {
      this.$emit("input", e);
    }
  }
});
</script>

<style>
.vs-radio-content {
  margin: 1rem;
}
</style>
